/*
 * @Author: Lzx
 * @LastEditors: Lzx
 * @Date: 2021-06-24 09:06:36
 * @LastEditTime: 2021-07-06 11:30:41
 * @FilePath: /YLFYJK_WEB/src/assets/css/panel-layout.scss
 * @Description: 页面布局通用样式
 */
 
// 通用卡片面板样式值
$cardBoxShadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
$cardBorderRadius: 15px;
$cardPadding: 15px 15px;

// 行级面板（父标签）通用样式
.row-panel-first {
    margin-top: 0px !important;
}

.row-panel {
    margin-top: 30px;

    // 卡片组件
    .el-card {
        border-radius: $cardBorderRadius;
    }

    // card header h1 h2 h3 ...
    .el-card__header {

        h1,
        h2,
        h3,
        h4 {
            margin: 0px;
        }
    }
}

// 柱状图、排名列表面板
.chart-panel {

    // 主体内容
    .content {
        margin-top: 30px;
    }

    // 排名列表
    .rank-list {
        margin: 0px;
        max-height: 350px;
        overflow-y: scroll;

        li {
            margin: 15px 0px;
        }

        .rank sup {
            font-size: 18px;
        }

        .el-badge {
            width: 20%;
        }

        .name {
            display: inline-block;
            width: 45%;
            color: lightslategray;
        }

        .value {
            display: inline-block;
            width: 35%;
            text-align: right;
        }
    }
}

// 按钮
.el-form-item {
    .el-form-item__content {
        .el-button {
            margin-left: 10px;
        }
    }
}